<!-- 国际行业分类 -->
<template>
    <el-cascader
            :options="industry"
            :props="propsIndustry"
            @active-item-change="IhandleItemChange"
            @change="change"
            :value="initValue"
            :show-all-levels="false"
    ></el-cascader>
</template>

<script lang="ts">
    import { Vue, Component } from 'vue-property-decorator';
    @Component({})
    export default class IndustryType extends Vue {
        industry = []             // options：可选数据源
        propsIndustry = {               // props：是一个对象，相关配置如下
            value: 'industryCode',
            label: 'industryName',
            children: 'industry'
        }
        initValue = []         // value：选中项绑定值

        // active-item-change：当父级选项发生变化是触发，各父级选项组成的数组（所以在调用的时候，默认参数要传数组）
        async IhandleItemChange (ids) {
            if(ids.length === 0){
                this.industry = await this.getIndustry('1','', false);
            }else if (ids.length === 1){
                for(let i = 0; i < this.industry.length; i++){
                    if (this.industry[i].industryCode == ids[0]){
                        this.industry[i].industry = await this.getIndustry('2',ids[0], false);
                    }
                }
            }else if (ids.length === 2){
                for (let i = 0; i < this.industry.length; i++) {
                    if (this.industry[i].industryCode === ids[0]) {
                        for (let j = 0; j < this.industry[i].industry.length; j++) {
                            if (this.industry[i].industry[j].industryCode === ids[1]) {
                                this.industry[i].industry[j].industry = await this.getIndustry('3',ids[1], false);
                            }
                        }
                    }
                }
            }else if(ids.length === 3){
                for (let i = 0; i < this.industry.length; i++) {
                    if (this.industry[i].industryCode === ids[0]) {
                        for (let j = 0; j < this.industry[i].industry.length; j++) {
                            if (this.industry[i].industry[j].industryCode === ids[1]) {

                                for(let k = 0; k < this.industry[i].industry[j].industry.length; k++){
                                    if(this.industry[i].industry[j].industry[k].industryCode === ids[2]){
                                        this.industry[i].industry[j].industry[k].industry = await this.getIndustry('4',ids[2], true);
                                    }
                                }

                            }
                        }
                    }
                }
            }
        }

        // 获取地址请求
        async getIndustry (industryLevel: string, industryCode: string, isEnd: boolean) {
            let params = {
                industryLevel: industryLevel,
                industryCode: industryCode
            }
            let response = await this.$http.get('fbank/constants/industryCode',{params},{ loading: false })
            if(!isEnd){
                response.data.forEach(v => v.industry = []);
            }
            return response.data;
        }
        mounted () {
            this.IhandleItemChange([]);
        }
        // change：当绑定事件触发时，回调是当前值
        change (areas) {
            this.$emit('input', areas);
        }
        async init (initValue) {
            this.initValue = initValue
            setTimeout(async () => {
                for (let i = 0; i < this.industry.length; i++){
                    if (this.industry[i].industryCode == initValue[0]){
                        this.industry[i].industry = await this.getIndustry('2', initValue[0], false);
                        for(let j = 0; j < this.industry[i].industry.length; j ++){
                            if(this.industry[i].industry[j].industryCode == initValue[1]){
                                this.industry[i].industry[j].industry = await this.getIndustry('3', initValue[1], false);
                                for(let k = 0; k < this.industry[i].industry[j].industry.length; k++){
                                    if(this.industry[i].industry[j].industry[k].industryCode === initValue[2]){
                                        this.industry[i].industry[j].industry[k].industry = await this.getIndustry('4',initValue[2], true);
                                    }
                                }
                            }
                        }
                    }
                }
            })
        }
    }
</script>

<style scoped>

</style>